<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
        <script src="pdf/web/viewer.js"></script>
    </head>
	<script src="jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	<body>
	<div>
<!--		<button class='get'>点击获取</button>-->
<!--		<button class='set1'>点击定位1</button>-->
		<button hidden="hidden" class='set2'>点击定位2</button>
		<div id='contain'></div>
	</div>
		<!-- 这里地址不能写相对路径，端口根据实际项目端口 打开参数 page是指要打开的页码，top是当前页面离顶部的高度，zoom是指页面缩放比例 -->
		<div id='ifreme' style='width:100%;height:600px'>
			<iframe id="iframe01"  name='iframe01' style="width:100%;height:100%;"
                    src=''>
            </iframe>
		</div>
	</body>
	<script type="text/javascript">
        $(document).ready(function() {
            window.addEventListener("message", function(e){
                console.log('收到的值', e.data)
                $('#iframe01').attr('src', e.data.url)
                // $(window.frames["iframe01"].document).scrollTop("100")
                if (e.data.top && e.data.cache) {
                    getlocation(e.data.top, e.data.cache)
                    setTimeout(() => {
                        getMessage(e.data.searchTxt)
                    }, 500)
                    // getMessage(e.data.searchTxt)
                } else if (e.data.searchTxt) {
                    getMessage(e.data.searchTxt)
                }
            }, false)
            let frameWidow = document.getElementById('iframe01').contentWindow
            frameWidow.document.documentElement.scrollTop = 1000
            console.log('滚动条的位置2', frameWidow.document.documentElement.scrollTop)
        })
		$(function() {
			setTimeout(function() {
				console.log("长度:",$("#iframe01").contents().find(".linkAnnotation").length)
				console.log("长度33:",$("#iframe01").contents().find(".linkAnnotation"))
				var child = $("#iframe01").contents().find(".linkAnnotation")
				console.log('child', child)
				child.click(function (event){
					var x = event.clientX;
					var y = event.clientY;
					console.log("子页面被点击了",x,y)
					console.log("当前页码:",$("#iframe01").contents().find("#pageNumber").val())
				})
			}, 500);
		})
        // 滑选事件注册： 获取鼠标选中的文本
        const getSelectText = () => {
            let iframe = document.getElementById('iframe01');
            let x = '';
            let y = '';
            let _x = '';
            let _y = '';
            // iframe 加载完成后执行并将双击事件过滤掉，因为双击事件可能也触发滑选，所以为了不误操作，将其剔除
            iframe.onload = function () {
                // 鼠标点击监听
                iframe.contentDocument.addEventListener('mousedown', function (e) {
                    x = e.pageX;
                    y = e.pageY;
                }, true);
                // 鼠标抬起监听
                iframe.contentDocument.addEventListener('mouseup', function (e) {
                    _x = e.pageX;
                    _y = e.pageY;
                    if (x == _x && y == _y) return; //判断点击和抬起的位置，如果相同，则视为没有滑选，不支持双击选中
                    let  choose = iframe.contentWindow.getSelection().toString();
                    let scrollX = document.documentElement.scrollLeft || document.body.scrollLeft
                    let scrollY = document.documentElement.scrollTop || document.body.scrollTop
                    const sX = e.clientX + scrollX
                    const sY = e.clientY + scrollY
                    console.log(' _x',  e.clientX)
                    console.log('_y',  e.clientY)
                    console.log(' sX', sX)
                    console.log('sY', sY)
                    console.log('width', window.screen.width)
                    console.log('height', window.screen.height)
                    window.parent.postMessage({scanPdfX: sX, scanPdfY: sY,screenWidth: window.screen.width, screenHeight: window.screen.height},'*' )
                    console.log('选择了那些文本', choose)
                    console.log('pageX',   _x)
                    console.log('pageY',  _y)
                    console.log('iframe.contentWindow.getSelection()', iframe.contentWindow.getSelection())
                    window.parent.postMessage({text: choose},'*' )
                    getPostion()
                }, true);
            };
        }
        getSelectText()
        let getPostion = () => {
            //获取子页面对应的页面编码和top
            let top = $("#iframe01").contents().find("#page_top").val();
            let cache = $("#iframe01").contents().find("#page_cache").val().split(" ")[0];
          //  $("#contain").text("获取的定位信息：top="+top+"::: cache="+cache)
            console.log('位置信息', top , cache)
            let iframe = document.getElementById('iframe01');
            console.log('位置信息winw',iframe.contentWindow)
            window.parent.postMessage({top: top,  cache: cache}, '*')
        }
        let getlocation = (top, cache) => {
            console.log('位置值是', cache, top)
            getVirtualLocation();
            if($("#iframe01").contents().find(".addLink").length!=0){
                $("#iframe01").contents().find(".addLink").remove();
            }
            //console.log("top=="+top+"cache=="+cache)
            let str = "<a hidden:'hidden'  href='"
                + '#[{"num":'+cache+',"gen":0},{"name":"XYZ"},74,'+top+',0]'
                + "'class='internalLink addLink' id='p37318'><p></p></a>";
            //添加到子页面中
            //先判断是否有   没有再添加   有就不添加
            //alert($("#iframe01").contents().find("#p37318").length)
            if($("#iframe01").contents().find("#p37318").length==0){
                $("#iframe01").contents().find("body").append(str);
            }
            //alert($("#iframe01").contents().find("#p37318").find("p").length)

            $("#iframe01").contents().find("#p37318").find("p")[0].click();
        }
        let getVirtualLocation = () => {
            if($("#iframe01").contents().find(".addLink").length!=0){
                $("#iframe01").contents().find(".addLink").remove();
            }
            let str = "<a  href='"
                + '#[{"num":17,"gen":0},{"name":"XYZ"},74,192,0]'
                + "'class='internalLink addLink' id='p17192'><p>GG</p></a>";
            //添加到子页面中
            //先判断是否有   没有再添加   有就不添加
            // alert($("#iframe01").contents().find("#p37318").length)
            if($("#iframe01").contents().find("#p17192").length==0){
                $("#iframe01").contents().find("body").append(str);
            }
            //alert($("#iframe01").contents().find("#p17192").find("p").length)

            $("#iframe01").contents().find("#p17192").find("p")[0].click();
        }
        // 接受数据
        let getMessage = (info) => {
            //获取iframe
            let iframe = document.getElementById('iframe01');
            // iframe监听是否有数据传入，将传入的数据作为参数传递给pdf.js的find接口
            //这里打印一下，看是否拿到了传入的数据
            let infoObj = JSON.parse(info)
            console.log('要搜的值',infoObj);
            console.log('执行了没',iframe.contentWindow)
            console.log('要搜的值txt',infoObj.txt);
            // 获取到的页码传入这里
          //  iframe.contentWindow.PDFViewerApplication.page = key
            // 这里打印的是pdf.js暴露出来的find接口
            console.log(iframe.contentWindow.PDFViewerApplication.findBar);
            // 输入查询数据
            iframe.contentWindow.PDFViewerApplication.findBar.findField.value = infoObj.txt;
            // 要求查询结果全体高亮
            iframe.contentWindow.PDFViewerApplication.findBar.highlightAll.checked = true;
            // 上面两部已经OK，触发highlightallchange方法。OK。全部完成，效果如文章开头。
            iframe.contentWindow.PDFViewerApplication.findBar.dispatchEvent('highlightallchange');
            var str = JSON.stringify(iframe.contentWindow.page_cache);
            console.log("格式为："+typeof(JSON.parse(str)))
            console.log("json的数据："+str)
            for(var key in JSON.parse(str)){
                console.log("key的数据：", JSON.parse(str)[key])
                if(JSON.parse(str)[key] === infoObj.loc.page + 1){
                    console.log("key的数据A：", key.split(" "))
                    let cache = key.split(" ")[0]
                     getlocation(infoObj.loc.x1 * 2, cache)
                    return key;
                }
            }
        }
    </script>
</html>
